<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>个人中心</title>
    <link rel="stylesheet" href="${ctx}/static/plug/frozenui-1.3.0/css/frozen.css" media="all"/>
    <link rel="stylesheet" href="${ctx}/static/css/user/addCarNo.css" media="all"/>
    <style type="text/css">
        .circle {
            width: 120px;
            height: 120px;
            -moz-border-radius: 50px;
            -webkit-border-radius: 50px;
            border-radius: 60px;
        }

    </style>
</head>
<body ontouchstart="">
<section class="ui-placehold-wrap">
    <div class="ui-placehold" style="height:100%">
        <div class="circle" style="margin-top:10%;">
            <img style="width:100%;height:100%;border-radius:60px" id="imgUser" src="${userInfo.image}"/>
        </div>

    </div>
</section>
<section class="ui-container">
    <div style="text-align:center;padding-top:40px;margin-top:10px;">
        <span style="font-size:18px;" id="spanName">${userInfo.name}</span>
        <p class="ui-txt-muted"><span>${userInfo.phone}</span> <a href="javascript:void(0);" onclick="funcMyPhoneNo()">修改</a>
        </p>

    </div>
    <div class="ui-flex ui-flex-ver ui-flex-pack-center ui-flex-align-start" style="margin-top:30px;">
        <ul class="ui-list ui-list-pure ui-border-tb">
            <li class="ui-border-t">
                <div class="ui-row-flex" style="font-size: 17px;padding-top:8px;padding-bottom:8px"
                     onclick="funcMyMoney()">
                    <div class="ui-col ui-col-2" style="vertical-align:middle;">
                        <img style="vertical-align:middle;" src="${ctx}/static/image/user/icon-money.pic" width="30px"
                             height="23px" alt=""/>
                        <span style="font-size: 16px;padding-left:10px;text-align:right;vertical-align:middle;">我的钱包</span>
                    </div>
                    <div class="ui-col  ui-txt-muted" style="font-size: 16px;padding-right:20px;text-align:right;">
                        <fmt:formatNumber type="number" value="${userInfo.money / 10}" pattern="0.00"
                                          maxFractionDigits="2"/></div>
                </div>
            </li>
            <li class="ui-border-t">
                <div class="ui-row-flex" style="font-size: 17px;padding-top:10px;padding-bottom:8px"
                     onclick="funcMyCarNo()">
                    <div class="ui-col ui-col-2" style="vertical-align:middle;">
                        <img style="vertical-align:middle;" src="${ctx}/static/image/user/icon-car.pic" width="30px"
                             height="23px" alt=""/>
                        <span style="font-size: 16px;padding-left:10px;text-align:right;vertical-align:middle;">我的车辆</span>
                    </div>
                    <div class="ui-col ui-txt-muted" style="font-size: 16px;padding-right:20px;text-align:right;">
                        <a href="javascript:void(0)" onclick="funcMyCarNo()"><span id="spanMyCarNo">${carNo}</span></a>

                    </div>
                </div>
            </li>
            <li class="ui-border-t">
                <div class="ui-row-flex" style="font-size: 17px;padding-top:10px;padding-bottom:8px"
                     onclick="funcTransDtl()">
                    <div class="ui-col ui-col-2" style="vertical-align:middle;">
                        <img style="vertical-align:middle;" src="${ctx}/static/image/user/icon-trans.pic" width="30px"
                             height="23px" alt=""/>
                        <span class=""
                              style="font-size: 16px;padding-left:10px;text-align:right;vertical-align:middle;">交易流水</span>
                    </div>
                    <div class="ui-arrowlink" style=""></div>
                </div>
            </li>
        </ul>
    </div>
</section>
</body>
<script src="${ctx}/static/plug/frozenui-1.3.0/lib/zepto.min.js"></script>
<script src="${ctx}/static/plug/frozenui-1.3.0/js/frozen.js"></script>
<script src="${ctx}/static/js/common.js"></script>
<script src="${ctx}/static/js/user/addCarNo.js"></script>
<script src="${ctx}/static/plug/layer_mobile/layer.js"></script>
<script>

    var paramObj = {
        "registerParams": "${registerParams}",
        "myMoneyParams": "${myMoneyParams}",
        "myCarNoParams": "${myCarNoParams}",
        "transDetailParams" :"${transDetailParams}"
    };

    $(function () {
        var carNo="${carNo}";
        if(!carNo){
            $("#spanMyCarNo").html("添加");
        }

    });

    function funcMyPhoneNo() {
        //window.location.href="${ctx}/page/user/register?userId=${userId}";
        window.location.href = "${action}?params=" + paramObj.registerParams;
    }

    function funcMyMoney() {
        //window.location.href="${ctx}/page/recharge/myMoney?userId=${userId}";
        window.location.href = "${action}?params=" + paramObj.myMoneyParams;
    }


    function funcMyCarNo() {
        //window.location.href="${ctx}/user/myCarNo?userId=${userId}";
        window.location.href = "${action}?params=" + paramObj.myCarNoParams;
    }

    function funcTransDtl() {
        //window.location.href="${ctx}/user/recharge/transDetail?userId=${userId}";
        window.location.href = "${action}?params=" + paramObj.transDetailParams;
    }
</script>
</html>